<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>字体</title>
    <style>
        /* 设置字体 */
        p.serif{
            font-family: 'Times New Roman', Times, serif;
        }
        p.sansserif{
             font-family: Arial, Helvetica, sans-serif;
        }
        /* 设置字体样式 */
        p.normal{
            font-style: normal;
        }
        p.italic{
            font-style: italic;
        }
        p.italic{
            font-style: oblique;
        }
        /* 设置字体大小像素 */
        h5 {font-size:40px;}
h6 {font-size:30px;}
p {font-size:14px;}
    </style>
</head>
<body>
    <h1>CSS font-family</h1>
    <p class="serif">这一段的字体是 Times New Roman </p>
    <p class="sansserif">这一段的字体是 Arial.</p> 

    <p class="normal">这是一个段落,正常。</p>
<p class="italic">这是一个段落,斜体。</p>
<p class="oblique">这是一个段落,斜体。</p>

<h5>This is heading 1</h5>
<h6>This is heading 2</h6>
<p>This is a paragraph.</p>
<p>允许在 Internet Explorer 9, Firefox, Chrome, Opera, 和 Safari 中通过缩放浏览器调整文本大小。</p>
<p><b>注意:</b>这个例子在 IE9之前的版本不工作, prior version 9.</p>
</body>
</html>